<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>购物车</title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
		<link type="text/css" rel="stylesheet" href="css/style2.css" />
		<style>
			.arrow{
				width:32px ;
				height: 32px;
				background-image: url(img/arrow.png);
				position: fixed;
				top: 90%;
				right: 20px;
				z-index: 11;
			}
			*{
				margin: 0px;
				padding: 0px;
				list-style-type: none;
				text-decoration: none;
				color: #000000;
			}
			.heard{
				width: 100%;
				height: 200px;
			}
			.heard-top{
				width: 100%;
				height: 50px;
				background-color: #000000;
			}
			.heard-top div{
				width: 1200px;
				height: 50px;
				margin: auto;
				/*border: 1px solid white;*/
			}
			.heard-top div img{
				width: 200px;
				height: 50px;
				float: left;
			}
			.heard-top div ul li a{
				width: 100px;
				height: 50px;
				float: right;
				color: #FFFFFF;
				line-height: 50px;
				text-align: center;
			}
			.heard-top div ul li:hover a{
				color: #FE9126;
				transition: all 1s;
			}
			/*顶部黑色导航栏*/
			.heard-cen{
				width: 100%;
				height: 100px;
				background-color: white;
			}
			.heard-cen div{
				width: 1200px;
				height:100px;
				/*border: 1px solid;*/
				position: relative;
				margin: auto;
			}
			.heard-cen div h1{
				margin: auto;
				width: 500px;
				height: 100px;
				font-size: 50px;
				line-height: 100px;
				color: #FE9126;
			}
			.heard-cen div input{
				width: 250px;
				height: 40px;
				font-size: 30px;
				position:absolute;
				top: 30px;
				right: 70px;
			}
			.heard-cen div span{
				width: 40px;
				height: 40px;
				float: right;
				position: absolute;
				top: 30px;
				right:20px;
				border: 1px solid;
				background-position-x: -12px;
				background-position-y: 53px;
				background-image:url(img/sousuo.png) ;
			}
			.heard-cen div span:hover{
				background-image: url(img/sss.png);
			}
			/*中间白色导航带搜索框*/
			.heard-bot{
				width: 100%;
				height: 50px;
				background-color: #FE9126;
			}
			.h-b-d{
				width: 1200px;
				height:50px;
				margin: auto;
				/*border: 1px solid;*/
				position: relative;
			}
			.index{
				width: 200px;
				height: 50px;
				float: left;
				line-height: 50px;
				text-align: center;
				/*border: 1px solid;*/
			}
			.one{
				width:200px;
				height: 50px;
				line-height: 50px;
				text-align: center;
				float: left;
				cursor: pointer;
				/*border: 1px solid;*/
			}
			.two{
				display: none;
				width: 200px;
				height: 250px;
				background-color: white;
				z-index: 4;
				position: relative;
				box-shadow: 0px 0px 5px;
				/*border: 1px solid;*/
			}
			.two ol li a{
				width: 200px;
				height: 60px;
				line-height: 60px;
				text-align: center;
				display: block;
				color: #999999;
			}
			.two ol li:hover a{
				color: #FE9126;
				box-shadow: 0px 0px 5px;
			}
			.one:hover .two{
				display: block;
			}
			/*导航栏结束可以复制*/
			.bottom{
				width: 100%;
				height: 300px;
				text-align: center;
				background-color: #2B2A2A;
			}
			.bottom img{
				width: 400px;
				height:90px;
				margin-top: 100px;
			}
			.bottom a{
				width: 100%;
				min-height: 50px;
				line-height: 50px;
				text-align: center;
				color: white;
				display: block;
			}
			/*默认*/
			.body{
				width: 100%;
				height: 750px;
				margin: auto;
				margin-top: 70px;
				position: relative;
			}
		</style>
	</head>
	<!--
    	作者：王风宝
    	时间：2019-11-22
    	描述：购物车
    -->
	<body>
		<div class="heard"><!--顶部导航-->
		<a href="#DINGBU" class="arrow"></a>
				<div class="heard-top">
					<div>
						<img src="img/logo.png" /><a name="DINGBU">
						<ul>
							<li><a href="购物车（2）.html">购物车</a></li>
							<li><a href="登录（2）.html">登录</a></li>
							<li><a href="注册（2）.html">注册</a></li>
							<li><a href="关于（2）.html">关于</a></li>
						</ul></a>
					</div>
				</div><!--顶部黑色-->
				<div class="heard-cen">
					<div>
						<h1>SUPER MARKET</h1>
						<input type="text" />
						<span></span>
					</div>
				</div>
				<div class="heard-bot">
					<div class="h-b-d">
						<ul>
							<li class="index"><a href="index.html">首页</a></li>
							<li class="one">
								<p>水果</p>
								<div class="two">
									<ol>
										<li><a href="水果(2).html">春季水果</a></li>
										<li><a href="水果(2).html">夏季水果</a></li>
										<li><a href="水果(2).html">冬季水果</a></li>
										<li><a href="水果(2).html">秋季水果</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>蔬菜</p>
								<div class="two">
									<ol>
										<li><a href="蔬菜.html">青菜</a></li>
										<li><a href="蔬菜.html">干菜</a></li>
										<li><a href="蔬菜.html">肉类</a></li>
										<li><a href="蔬菜.html">海鲜</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>零食</p>
								<div class="two">
									<ol>
										<li><a href="零食（2）.html">坚果</a></li>
										<li><a href="零食（2）.html">辣条</a></li>
										<li><a href="零食（2）.html">饼干</a></li>
										<li><a href="零食（2）.html">干果</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>生活用品</p>
								<div class="two">
									<ol>
										<li><a href="生活用品（2）.html">餐具</a></li>
										<li><a href="生活用品（2）.html">家具</a></li>
										<li><a href="生活用品（2）.html">卫浴</a></li>
										<li><a href="生活用品（2）.html">服饰</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<a href="每日推荐2.html">每日特价</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<!--顶部导航结束-->
			<div class="body">
				<div class="shopping-car-container">
					<div class="car-headers-menu">
						<div class="row">
							<div class="col-md-1 car-menu">
								<label><input type="checkbox" id="check-goods-all" /><span id="checkAll">全选</span></label>
							</div>
							<div class="col-md-3 car-menu">商品信息</div>
							<div class="col-md-3 car-menu">商品参数</div>
							<div class="col-md-1 car-menu">单价</div>
							<div class="col-md-1 car-menu">数量</div>
							<div class="col-md-1 car-menu">金额</div>
							<div class="col-md-2 car-menu">操作</div>
						</div>
					</div>
					<div class="goods-content">
						<!--goods display-->
					</div>
					<div class="panel panel-default">
						<div class="panel-body bottom-menu-include">
							<div class="col-md-1 check-all-bottom bottom-menu">
								<label>
										<input type="checkbox" id="checked-all-bottom" />
										<span id="checkAllBottom">全选</span>
									</label>
							</div>
							<div class="col-md-1 bottom-menu">
								<span id="deleteMulty">
										删除
								</span>
							</div>
							<div class="col-md-6 bottom-menu">
				
							</div>
							<div class="col-md-2 bottom-menu">
								<span>已选商品 <span id="selectGoodsCount">0</span> 件</span>
							</div>
							<div class="col-md-1 bottom-menu">
								<span>合计：<span id="selectGoodsMoney">0.00</span></span>
							</div>
							<div class="col-md-1 bottom-menu submitData submitDis">
								结算
							</div>
						</div>
					</div>
					<!--删除确认弹框-->
					<div class="modal fade" tabindex="-1" role="dialog" id="deleteItemTip" aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
									<h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
								</div>
								<div class="modal-body">
									确认删除此商品？
								</div>
								<div class="modal-footer">
									<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
									<button type="button" class="btn btn-primary deleteSure">确定</button>
								</div>
							</div>
						</div>
					</div>
					<!--是否勾选商品提示-->
					<div class="modal fade" tabindex="-1" role="dialog" id="selectItemTip" aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
									<h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
								</div>
								<div class="modal-body">
									请选择要删除的商品！
								</div>
								<div class="modal-footer">
									<button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
								</div>
							</div>
						</div>
					</div>
					<!--批量删除商品-->
					<div class="modal fade" tabindex="-1" role="dialog" id="deleteMultyTip" aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
									<h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
								</div>
								<div class="modal-body">
									确认删除选择的商品！
								</div>
								<div class="modal-footer">
									<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
									<button type="button" class="btn btn-primary deleteMultySure">确定</button>
								</div>
							</div>
						</div>
					</div>
				</div>
							
							
					
					
		<div class="bottom">
			<img src="img/logo2.png" />
			<a href="#DINGBU">返回顶部</a>
		</div>
	</body>
	<script type="text/javascript" src="js/jquery.min2.js"></script>
	<script type="text/javascript" src="js/script.js"></script>
</html>
